<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>消息</title>
    <script src="../../js/flexible.js"></script>
    <link rel="stylesheet" href="../../css/common/base.css">
    <link rel="stylesheet" href="../..//css/common/header-footer.css">
    <link rel="stylesheet" href="../../css/cl/common.css">
    <link rel="stylesheet" href="../../css/cl/xiaoxi.css">
</head>
<body>
     <!-- 头部------------------- -->
     <header>
        <div class="header_top">
            <img src="../../img/信号组.png" alt="">
            <span class="header_time">上午 9:51</span>
            <span class="ht_right">
                <img src="../../img/蓝牙图标.png" alt="">
                <img src="../../img/电量百分比.png" alt="">
                <img src="../../img/电量图标.png" alt="">
            </span>
        </div>
        <div class="header_bottom">
            <div class="hb_left">
                <!-- <img src="../../img/返回按钮-1.png" alt=""> -->
                <!-- 需要更改title文字 -->
                <span class="title">&nbsp;消息</span>
            </div>
            <div class="hb_right">
                <img src="../../img/组 -1.png" alt="">
            </div>
        </div>
    </header>
    <!-- 头部 -->
    <div class="header"></div>
    <!-- 搜索框 -->
    <section class="sec1">
        <div class="search">
            <img src="../../img/搜索.png" alt="">
            <span>搜索</span>
        </div>
    </section>
    <div class="empty"></div>
    <!-- main -->
    <ul class="main">
        <li>
            <a href="#">
                <div class="common tupian1">
                    <img src="../../img/cl/通知.png" alt="">
                </div>
                <div class="text">
                    <p>
                        <span>系统消息</span>
                        <span>10:48</span>
                    </p>
                    <p>
                        <span>
                            [10条]小助理:这个春天最火的摄影在你心里
                        </span>
                        <span class="hongdian"></span>
                    </p>
                </div>
            </a>
        </li>
        <li>
            <a href="#">
                <div class="common tupian2">
                    <img src="../../img/cl/点赞 (1).png" alt="">
                </div>
                <div class="text">
                    <p>
                        <span>赞</span>
                        <span>昨天</span>
                    </p>
                    <p>
                        <span>
                            [3个]小助理:这个春天最火的摄影在你心里
                        </span>
                        <span class="hongdian"></span>
                    </p>
                </div>
            </a>
        </li>
        <li id="dianji">
            <a href="../cl/huihua.html">
                <div class="common tupian3">
                    <img src="../../img/cl/头像_1.jpg" alt="">
                </div>
                <div class="text">
                    <p>
                        <span>李晓红</span>
                        <span>刚刚</span>
                    </p>
                    <p>
                        <span>
                            我在等风，也在等你
                        </span>
                        <!-- <span class="hongdian" id="hd"></span> -->
                    </p>
                </div>
            </a>
        </li>
    </ul>
    <!-- ---底部---------------------------------------- -->
    <footer>
        <ul>
            <li id="shouye">
                <a href="../trm/shouye.html">
                    <img src="../../img/返回首页.png" alt="">
                    <span>首页</span>
                </a>
            </li>
            <li id="huati">
                <a href="../cl/huati.html">
                    <img src="../../img/组 356.png" alt="">
                    <span>话题</span>
                </a>
            </li>
            <li id="renwu">
                <a href="../zyj/faburenwu.html">
                    <img src="../../img/组 359.png" alt="">
                    <span>任务</span>
                </a>
            </li>
            <li>
                <a href="../cl/xiaoxi.html"  id="xiaoxi">
                    <img src="../../img/cl/消息 (1).png" alt="">
                    <span>消息</span>
                </a>
            </li>
            <li id="wode">
                <a href="../wzy/wode.html">
                    <img src="../../img/组 358.png" alt="">
                    <span>我的</span>
                </a>
            </li>
        </ul>
    </footer>
</body>
<script>
    var dianji = document.getElementById("dianji");
    var hongdian = document.getElementById("hd");
    dianji.onclick = function(event){
        event.cancelBubble = true;
        hongdian.style.display = "none";
    }
</script>
</html>